<template>
    <div id="mainView">
        <!-- 加载动画，可以获取到初始化数据后显示路由 -->
        <init-load v-if="showInit" />
        <!-- 锁屏页，可以根据要求建锁、解锁、当前默认密码123456  -->
        <lock v-if="showLock" @hidden="handleVisible" />
        <!-- 业务路由视图 -->
        <router-view v-if="!showLock"></router-view>
    </div>
</template>

<script>
import InitLoad from '@/packages/layout/initSpin.vue'
import Lock from '@/packages/layout/lock/index.vue'

export default {
    data() {
        return {
            showLock: true,
            showInit: false
        }
    },
    mounted() {
        /**
         * initialize 是解决用户初次加载白屏。
         * */
        const _initView = document.getElementById('initializeView')
        _initView && _initView.remove()
    },
    methods: {
        handleVisible(bool) {
            this.showLock = bool
            this.showInit = !this.showInit
        }
    },
    beforeDestroy() {
        this.showLock = true
        this.showInit = false
    },
    components: {
        InitLoad,
        Lock
    }
}
</script>

<style>
@import 'packages/css/init.css';

html,
body,
#app,
#mainView {
    height: 100%;
}
</style>
